<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <p>全局变量计数。</p>
    <button type="button" onclick="myFunction()">计数!</button>
    <p id="demo">0</p>
</body>
<script>
    // 复杂闭包：
    // function foo() {
    //     var num = 2.3;
    //     function sum() {
    //         num++ //先赋值在++
    //         return num
    //     }
    //     return sum;
    // }
    // var jieguo = foo()
    // console.log(jieguo()); //3.3
    // console.log(jieguo()); //4.3


    // 给对象设置私有变量并且利用特权方法去访问私有属性
    // var name = '张三'
    // function obj() {
    //     let name = '张三111'
    //     return {
    //         getName() {
    //             return name
    //         },
    //     }
    // }
    // let res = obj()
    // //全局作用域下 是不能直接访问局部变量
    // console.log(res.getName())

    // 计数器困境
    // 设想下如果你想统计一些数值，且该计数器在所有函数中都是可用的。
    // 你可以使用全局变量，函数设置计数器递增：
    var counter = 0;
    function add() {
        return counter += 1;
    }
    function myFunction() {
        document.getElementById("demo").innerHTML = add();
    }
</script>

</html>